<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE HTML>
<html>
	<head>
		<base href="<%=basePath%>">
		
		<!-- 从被装饰页面获取title标签内容,并设置默认值-->
		<title>后台管理-<sitemesh:write property='title' /></title>
		
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta name="author" content="CH.HUANG" />
		<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=Edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		
		<link rel="shortcut icon" href="assets/images/favicon.ico" />
		
		<!-- CSS Libs -->
		<link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css">
		<link rel="stylesheet" type="text/css" href="assets/css/font-awesome.min.css">
		<link rel="stylesheet" type="text/css" href="assets/css/animate.min.css">
		<link rel="stylesheet" type="text/css" href="assets/css/bootstrap-switch.min.css">
		<link rel="stylesheet" type="text/css" href="assets/css/checkbox3.min.css">
		<link rel="stylesheet" type="text/css" href="assets/css/jquery.dataTables.min.css">
		<link rel="stylesheet" type="text/css" href="assets/css/dataTables.bootstrap.css">
		<link rel="stylesheet" type="text/css" href="assets/css/select2.min.css">
		
		<link href="assets/message/message.css" rel='stylesheet' type='text/css' />
		<!-- [if IE] > 
		<link href="assets/message/messageIE.css" rel='stylesheet' type='text/css' />
		<![endif] --> 
		<link href="assets/spop/spop.min.css" rel='stylesheet' type='text/css' />
		<link href="assets/loading/loading.css" rel='stylesheet' type='text/css' />
		<link rel='stylesheet' type='text/css' href="assets/bealert/BeAlert.css" />
		
		<!-- CSS App -->
		<link rel="stylesheet" type="text/css" href="assets/css/style.css">
		<link rel="stylesheet" type="text/css" href="assets/css/themes/flat-blue.css">
		
		<!-- Javascript Libs -->
		<script type="text/javascript" src="assets/js/jquery.min.js"></script>
		<script type="text/javascript" src="assets/js/vue.min.js" ></script>
		<script type="text/javascript" src="assets/js/fetch.min.js" ></script>
		<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
		<script type="text/javascript" src="assets/js/bootstrap-switch.min.js"></script>
		<script type="text/javascript" src="assets/js/jquery.matchHeight-min.js"></script>
		<script type="text/javascript" src="assets/js/jquery.dataTables.min.js"></script>
		<script type="text/javascript" src="assets/js/jquery.dataTables.zh_cn.js"></script>
		<script type="text/javascript" src="assets/js/dataTables.bootstrap.min.js"></script>
		<script type="text/javascript" src="assets/js/select2.full.min.js"></script>
		<script type="text/javascript" src="assets/js/jquery.cookie.js"></script>
		<script type="text/javascript" src="assets/js/ace/ace.js"></script>
		<script type="text/javascript" src="assets/js/ace/mode-html.js"></script>
		<script type="text/javascript" src="assets/js/ace/theme-github.js"></script>
		<!-- Javascript -->
		<script type="text/javascript" src="assets/js/app.js"></script>
		
		<script type="text/javascript" src="assets/message/message.js" ></script>
		<script type="text/javascript" src="assets/spop/spop.min.js" ></script>
		<script type="text/javascript" src="assets/loading/loading.js" ></script>
		<script type="text/javascript" src="assets/bealert/BeAlert.js" ></script>
		
		<script type="text/javascript" src="assets/js/common.js"></script>
		<script type="text/javascript" src="assets/js/fetchFun.js"></script>
		<script type="text/javascript" src="pages/system/user/js/SuperAdmin.js"></script>
		
		<!-- 从被装饰页面获取body标签内容 -->
		<sitemesh:write property='head' />
	</head>
	
	<body class="flat-blue">
		
		<div id="appContainer" class="app-container">
			<div class="row content-container">
				<nav class="navbar navbar-default navbar-fixed-top navbar-top">
					<div class="container-fluid">
						<div class="navbar-header">
							<button id="navbarExpandButton" type="button" class="navbar-expand-toggle">
                            	<i class="fa fa-bars icon"></i>
                        	</button>
							<ol class="breadcrumb navbar-breadcrumb">
								<li id="activeMenuTitle" class="active">{{menuTitle}}</li>
							</ol>
							<button type="button" class="navbar-right-expand-toggle pull-right visible-xs">
                            	<i class="fa fa-th icon"></i>
                        	</button>
						</div>
						<ul class="nav navbar-nav navbar-right">
							<button type="button" class="navbar-right-expand-toggle pull-right visible-xs">
                            	<i class="fa fa-times icon"></i>
                        	</button>
							<li class="dropdown profile">
								<a id="loginUser" href="javascript:void(0);" data-id="<%=request.getSession(false).getAttribute("userId") %>" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
									<%=request.getSession(false).getAttribute("username") %>
									<span class="caret"></span>
								</a>
								<ul class="dropdown-menu animated fadeInDown">
									<li class="profile-img">
										<img src="assets/images/profile.jpg" class="profile-img">
									</li>
									<li>
										<div class="profile-info">
											<div class="btn-group margin-bottom-2x" role="group">
												<button id="pswButton" type="button" class="btn btn-default"><i class="fa fa-key"></i> 修改密码</button>
												<button id="logoutButton" type="button" class="btn btn-default"><i class="fa fa-sign-out"></i> 退出登录</button>
											</div>
										</div>
									</li>
								</ul>
							</li>
						</ul>
					</div>
				</nav>
				<div class="side-menu sidebar-inverse">
					<nav class="navbar navbar-default" role="navigation">
						<div class="side-menu-container">
							<div class="navbar-header">
								<a class="navbar-brand" href="javascript:void(0);">
									<div class="icon" style="color: #F0AD4E; font-weight: bold;">UR</div>
									<div class="title">后台管理</div>
								</a>
								<button type="button" class="navbar-expand-toggle pull-right visible-xs">
                                <i class="fa fa-times icon"></i>
                            </button>
							</div>
							<ul id="menuList" class="nav navbar-nav">
								<li class="active">
									<a href="pages/system/resource/resources.html">
										<span class="icon fa fa-tachometer"></span>
										<span class="title">资源列表</span>
									</a>
								</li>
								<li>
									<a href="pages/system/resource/upresource.html">
										<span class="icon fa fa-cloud-upload"></span>
										<span class="title">上传资源</span>
									</a>
								</li>
								<li class="panel panel-default dropdown adminMenu" hidden>
	                                <a data-toggle="collapse" href="#dropdown-table">
	                                    <span class="icon fa fa-user-circle-o"></span><span class="title">系统管理</span>
	                                </a>
	                                <!-- Dropdown level 1 -->
	                                <div id="dropdown-table" class="panel-collapse collapse">
	                                    <div class="panel-body">
	                                        <ul class="nav navbar-nav">
	                                            <li>
	                                            	<a href="pages/system/user/userlist.html">用户管理</a>
	                                            </li>
	                                            <li>
	                                            	<a href="pages/system/label/label.html">标签管理</a>
	                                            </li>
	                                        </ul>
	                                    </div>
	                                </div>
	                            </li>
							</ul>
						</div>
						<!-- /.navbar-collapse -->
					</nav>
				</div>
				
				<!-- Main Content -->
				<div class="container-fluid">
					<div class="side-body padding-top">
						<!-- 从被装饰页面获取body标签内容 -->
						<sitemesh:write property='body' />
					</div>
				</div>
				
			</div>
			
			<!-- <footer class="app-footer">
	            <div class="wrapper">
	                <span class="pull-right">1.0 <a href="#"><i class="fa fa-long-arrow-up"></i></a></span> © 2018 Copyright.
	            </div>
	        </footer> -->
		</div>
		
		<!-- password Modal -->
		<div id="password-modal" class="modal fade" tabindex="-1" role="dialog"
			aria-labelledby="myModalLabel">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-label="Close">
							<span aria-hidden="true">&times;</span>
						</button>
						<h4 class="modal-title" id="myModalLabel">修改密码</h4>
					</div>
					<div class="modal-body">
						
						<form id="password-form" class="form-horizontal">
						  
						  <div class="form-group">
						    <label for="oldPassword" class="col-md-2 control-label">原&nbsp;密&nbsp;码</label>
						    <div class="col-md-6">
						      <input type="password" class="form-control info-input" id="oldPassword" name="oldPassword" placeholder="原密码">
						    </div>
						    <label id="oldPassword-label" class="col-md-4 info-label"></label>
						  </div>
						  <div class="form-group">
						    <label for="password" class="col-md-2 control-label">新&nbsp;密&nbsp;码</label>
						    <div class="col-md-6">
						      <input type="password" class="form-control info-input" id="password" name="password" placeholder="新密码">
						    </div>
						    <label id="password-label" class="col-md-4 info-label"></label>
						  </div>
						  <div class="form-group">
						    <label for="confirmPassword" class="col-md-2 control-label">确认密码</label>
						    <div class="col-md-6">
						      <input type="password" class="form-control info-input" id="confirmPassword" placeholder="确认密码">
						    </div>
						    <label id="confirmPassword-label" class="col-md-4 info-label"></label>
						  </div>
						  
						</form>
						
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button id="password-save-btn" type="button" class="btn btn-primary">保存</button>
					</div>
				</div>
			</div>
		</div>
		
		<script type="text/javascript">
			//显示当前菜单
			var menuTitle = $('title').text().trim().split('-')[1];
			new Vue({
				el: '#activeMenuTitle',
				data:{
					menuTitle: menuTitle
				}
			});
			
			$(function(){
				//判断是不是第一管理员，显示用户菜单
				var uuid = $('#loginUser').data('id');
				if(superAdmins.indexOf('<'+uuid+'>')>-1){
					$('li.adminMenu').show();
				}else {
					$('li.adminMenu').hide();
				}
				
				//cookie中获取并执行展开还是收缩菜单列 
				if($.cookie('navbarExpandStatus') === 'true'){//展开
					$('#appContainer').addClass('expanded');
					$('#navbarExpandButton').addClass('fa-rotate-90');
				}else{//收缩
					$('#appContainer').removeClass('expanded');
					$('#navbarExpandButton').removeClass('fa-rotate-90');
				}
				
				//当前菜单高亮
				$('#menuList>li').each(function(i,v){
					if($(this).find('span.title').text().trim()==menuTitle){
						$(this).addClass('active');
					}else {
						$(this).removeClass('active');
					}
				});
				
				//保存菜单列展开状态到cookie
				$('#navbarExpandButton').click(function(){
					if($(this).hasClass('fa-rotate-90')){
						$.cookie('navbarExpandStatus', true, {path:'/'});
					}else {
						$.cookie('navbarExpandStatus', null, {expires: -1, path:'/'});
					}
				});
				
				//退出登录
				$('#logoutButton').click(function(){
					location.href = 'system/login/logout';
				});
				
				//弹出修改密码表单
				$('#pswButton').click(function(){
					$("#oldPassword").val("");
					$("#password").val("");
					$("#confirmPassword").val("");
					$(".info-label").html("");
					$("#password-modal").modal("show");
				});
				$('#password-form').submit(function(){
					return false;
				});
				//修改密码
				$("#password-save-btn").click(function(){
					var oldPassword = $("#oldPassword").val();
					if(oldPassword==null || typeof(oldPassword) == "undefined"){
						$("#oldPassword-label").html("<code>*请输入原密码*</code>");
						$("#oldPassword").focus();
						return false;
					}
					oldPassword = oldPassword.replace(/(^\s*)|(\s*$)/g, "");
					if(oldPassword==""){
						$("#oldPassword-label").html("<code>*请输入原密码*</code>");
						$("#oldPassword").focus();
						return false;
					}
					
					var password = $("#password").val();
					if(password==null || typeof(password) == "undefined"){
						$("#password-label").html("<code>*请输入新密码*</code>");
						$("#password").focus();
						return false;
					}
					password = password.replace(/(^\s*)|(\s*$)/g, "");
					if(password==""){
						$("#password-label").html("<code>*请输入新密码*</code>");
						$("#password").focus();
						return false;
					}
					
					var confirmPassword = $("#confirmPassword").val();
					if(confirmPassword==null || typeof(confirmPassword) == "undefined"){
						$("#confirmPassword-label").html("<code>*请输入确认密码*</code>");
						$("#confirmPassword").focus();
						return false;
					}
					confirmPassword = confirmPassword.replace(/(^\s*)|(\s*$)/g, "");
					if(confirmPassword==""){
						$("#confirmPassword-label").html("<code>*请输入确认密码*</code>");
						$("#confirmPassword").focus();
						return false;
					}
					if(confirmPassword!=password){
						$("#confirmPassword-label").html("<code>*新密码与确认密码不相同*</code>");
						$("#confirmPassword").focus();
						return false;
					}
					
					post('system/user/editPassword', function(data){
						if(data.success){
							$.message({message:'密码修改成功', type:'success'});
							$("#oldPassword").val("");
							$("#password").val("");
							$("#confirmPassword").val("");
							$(".info-label").html("");
							$("#password-modal").modal("hide");
						}else {
							spop(data.result, 'error');
						}
					}, {
						oldPassword: oldPassword,
						password: password
					});
					
				});
			});
			
		</script>
		
	</body>
	
</html>
